<!DOCTYPE html>
<html lang="utf-8" class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <#include "/comm/module-index.ftl"/>
</head>
<body>

<div class="layui-div-body">
    <div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">基础管理</a>
            <a>
              <cite>菜单管理</cite></a>
          </span>
    </div>
    <div class="layui-fluid layui-div-table">
        <div>
            <form class="layui-form" autocomplete="off" id="searchForm" lay-filter="searchForm">
                <div class="layui-inline layui-show-xs-block layui-input-wrap">
                    <input class="layui-input table-search-date" autocomplete="off" placeholder="开始日"
                           name="startDate" id="start">
                </div>
                <div class="layui-inline layui-show-xs-block">
                    <input class="layui-input table-search-date" autocomplete="off" placeholder="截止日" name="endDate"
                           id="end">
                </div>
                <div class="layui-inline layui-show-xs-block">
                    <input type="text" name="keyword" placeholder="关键字" autocomplete="off"
                           class="layui-input">
                </div>
                <div class="layui-inline layui-show-xs-block">
                    <button class="layui-btn  layui-btn-sm" lay-submit="" lay-filter="table-search"><i
                                class="layui-icon">&#xe615;</i></button>
                    <button class="layui-btn  layui-btn-sm layui-btn-primary" type="reset" id="btn-search-reset"><i
                                class="layui-icon">&#xe640;</i></button>
                </div>
            </form>
            <div class="common-btn-block">
                <button class="layui-btn  layui-btn-sm" lay-on="add"><i
                            class="layui-icon  layui-icon-add-1"></i> 添加
                </button>
                <button class="layui-btn  layui-btn-sm layui-btn-primary" id="btnExpand" lay-on="expand">全部展开
                </button>
            </div>
        </div>
        <#-- table-->
        <div class="layui-table-body" style="flex: 1" id="layui-table-bar">
            <table class="layui-hide" lay-filter="layui-table-main" id="layui-table-main"></table>
        </div>

    </div>
</div>

<script type="text/html" id="menuType">
    <#--    var __types = {"MENU": "菜单", "VIEWS": "链接", "BUTTON": "按钮"};-->
    {{#  if(d.ppType=='BUTTON'){ }}
    <button class="layui-btn layui-btn-primary layui-border-green layui-btn-xs">按钮</button>
    {{#  } else if(d.ppType=='MENU'){ }}
    <button class="layui-btn layui-btn-primary layui-btn-xs">菜单</button>
    {{#  } else { }}
    <button class="layui-btn  layui-bg-orange layui-btn-xs ">链接</button>
    {{#  } }}
</script>
<script type="text/html" id="myOperateBtn">
    {{#  if(d._status >-2){ }}
    <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
    {{#  } }}
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="destroy"><i class="layui-icon">&#xe616;</i>销毁</a>
</script>
<script type="text/javascript">
    layui.use(['index', 'table'], function () {
        let laydate = layui.laydate, util = layui.util, $ = layui.jquery;
        // 日期
        laydate.render({
            elem: '.table-search-date'
        });
        let tableBase = layui.index;
        tableBase.render({
            cols: [
                {type: 'space', hide: true, field: "_id"},
                {field: 'ppCode', title: '编码'},
                {field: 'name', title: '名称'},
                {field: 'ppAuth', title: '权限'},
                {field: 'ppType', title: '类型', width: 50, align: 'center', toolbar: '#menuType'},
                {field: 'ppSort', title: '排序', width: 50},
                {
                    field: 'ppDisplay', title: '显示', width: 50, align: 'center', templet: function (obj) {
                        return obj.ppDisplay === 1 ? "是" : "否";
                    }
                },
                {
                    field: 'ppIcon', title: '图标', width: 50, align: 'center', templet: function (obj) {
                        if (obj.ppIcon) {
                            return '<i class="layui-icon ' + obj.ppIcon + '"> </i>'
                        } else {
                            return "";
                        }
                    }
                },

                {field: 'ppRemark', title: '备注'},
                {field: 'createTime', title: '创建时间'},
                {title: '状态', field: '_status', toolbar: '#statusBtn', width: 50, align: 'center'},
                {fixed: 'right', title: '操作', toolbar: '#myOperateBtn', width: 200, align: 'center'}
            ],
            area: ['800px', '670px'],
            tree: {
                view: {
                    expandAllDefault: false
                }
            }
        })
        util.on({
            expand: function () {
                let t = trim($("#btnExpand").text());
                // 展开或关闭全部节点
                tableBase.expandAll(t === "全部展开"); // 关闭全部节点
                if (t === "全部展开") {
                    $("#btnExpand").text("全部收起")
                } else {
                    $("#btnExpand").text("全部展开")
                }

            }
        });
    });

</script>

</body>
</html>